Copper.TimeRegulator = function(config) {
    var radius = 18;
    var fillStyle = 'yellow';
    var lineLength = 20;
    this.angle = config.angle;

    config.drawFunc = function() {
        var context = this.getContext();
        var angle = this.angle;
        
        context.beginPath(); 
        
        context.moveTo(Copper.Global.centerX + (Copper.Global.clockRaius - lineLength) * Math.cos(angle),
            Copper.Global.centerY + (Copper.Global.clockRaius - lineLength) * Math.sin(angle));
        context.lineTo(Copper.Global.centerX + (Copper.Global.clockBorderRadius + 10) * Math.cos(angle),
            Copper.Global.centerY + (Copper.Global.clockBorderRadius + 10) * Math.sin(angle));
        context.lineWidth = 2;
        context.strokeStyle = fillStyle;
        context.stroke();
        context.closePath();
        context.beginPath();
        var x = Copper.Global.centerX + (Copper.Global.clockRaius - lineLength - radius) * Math.cos(angle);
        var y = Copper.Global.centerY + (Copper.Global.clockRaius - lineLength - radius) * Math.sin(angle);
        context.arc(x, y, radius, 0, Math.PI * 2, false);     
        context.fillStyle = fillStyle;
        context.fill();
        context.closePath();
    };
    
    this.fillStyle = 'rgba(0,0,0,0.2)';
    this.isSelected = config.isSelected? true: false;;
    this.taskId = config.taskId;
    

    
    
    
    // call super constructor
    Kinetic.Shape.apply(this, [config]);
    
    this.on('mousedown', this.mouseDown);
};

Copper.TimeRegulator.prototype = {

    mouseDown: function(e){
        var task = Copper.TaskManager.getCurrentTask();
        var mouseAngle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset);
        

        
        /*
        if(Copper.TaskManager.selectedTaskId == this.taskId){
            Copper.TaskManager.showTimeRegulator({
                startAngle: startAngle,
                endAngle: endAngle
            });
        }
         */
         
        console.log('Regulator mouse down at: ' + mouseAngle);
        
        var _this = this;

        var mouseMove = function(e){ 
            var newMouseAngle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset);
            _this.angle += newMouseAngle - mouseAngle;
            mouseAngle = newMouseAngle;
            
            //border check
            if((_this.minAngle && _this.angle < _this.minAngle) || (
                    _this.maxAngle && _this.angle > _this.maxAngle)){
                return false;        
            }
    
            console.log('Regulator mouse move at: ' + _this.angle);
            
            
            if(_this.mouseMoveHandler){
                _this.mouseMoveHandler.call(_this, _this.angle);
            }
            
            Copper.DummyLayer.refresh();
        };
        var mouseUp = function(e){

            var newMouseAngle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset);
            _this.angle += newMouseAngle - mouseAngle;
            mouseAngle = newMouseAngle;
            
            document.removeEventListener('mousemove', mouseMove);
            document.removeEventListener('mouseup', mouseUp);
            
            //border check
            if((_this.minAngle && _this.angle < _this.minAngle) || (
                    _this.maxAngle && _this.angle > _this.maxAngle)){
                return false;        
            }

            console.log('Regulator mouse up at: ' + _this.angle);
            
            if(_this.mouseUpHandler){
                _this.mouseUpHandler.call(_this, _this.angle);
            }

            
        };
         
        document.addEventListener('mousemove', mouseMove, false);
        document.addEventListener('mouseup', mouseUp, false);
        
        if(_this.mouseDownHandler){
            _this.mouseDownHandler.call(_this, _this.angle);
        }
    },

    _draw: function(layer) {
        //layer.add(this.circle);
        Kinetic.Shape.prototype._draw.apply(this, [layer]); 
        
          
    },
    
    getFillStyle: function(){
        return this.fillStyle;
    },
    
    setFillStyle: function(fillStyle){
        this.fillStyle = fillStyle;
    },
    
    setAngle: function(angle){
        this.angle = angle;
    },
    
    getAngle: function(){
        return this.angle;
    },
    
    setBorderValue: function(minAngle, maxAngle){
        this.minAngle = minAngle;
        this.maxAngle = maxAngle;    
    },
    
    toggle: function(){
        this.isSelected = !this.isSelected;
        this.fillStyle = this.isSelected? 'white': 'rgba(0,0,0,0.2)';
    }    

};
// extend Shape
Kinetic.GlobalObject.extend(Copper.TimeRegulator, Kinetic.Shape);